body {background: #f1f1f1}
.doc-toper{font-size:14px;background:#323436;padding:10px 0;color:#0AE;line-height: 20px}
.doc-toper a:link,.doc-toper a:visited{color:#f00;}
.doc-naver{padding-top:30px;padding-bottom:30px;}
.doc-logo{display:block;margin-bottom:10px;}
.doc-naver .nav a:link,.doc-naver .nav a:visited{font-size:16px;font-weight:bold;}
.doc-naver .nav .active a{color:#0a8;}
.doc-header.fixed-top{background-color:#fff;z-index:2;-webkit-box-shadow:0 3px 6px rgba(0, 0, 0, .175);box-shadow:0 3px 6px rgba(0, 0, 0, .175);}
.doc-header.fixed-top .doc-toper,.doc-header.fixed-top .doc-intro{display:none;}
.doc-header.fixed-top .doc-naver{padding-top:10px;padding-bottom:10px;background-color:#fff;}
.doc-h2{margin-bottom:15px;border-bottom:solid 1px #eee;padding-bottom:15px;font-size:28px;}
.doc-h3{margin:30px 0 10px 0;font-size:21px;}
.doc-lead{font-size:18px;}
.doc-readme{font-size:16px;}
.doc-title,.doc-code,.doc-demo,.doc-quote,.doc-quoteyellow,.doc-quotered,.doc-democode{margin-bottom:20px;}
.doc-code{border:solid 1px #ddd;padding:15px;border-radius:4px;background:#f5f5f5;}
.doc-demoview{border:solid 1px #ddd;padding:15px;border-radius:4px 4px 0 0;border-bottom:none;}
.doc-demoview:before{content:"示例";color:#999;}
.doc-demoview .view-head{color:#999;margin-bottom:10px;}
.doc-demoview .view-body{padding-top:15px;}
.doc-democode{border:solid 1px #ddd;border-radius:0 0 4px 4px;padding:15px;background:#f5f5f5;font-size:12px;}
.doc-blogview{border:solid 1px #ddd;padding:15px;border-radius:4px 4px 0 0;border-bottom:none;}
.doc-blogview:before{    content: "内容页";  color:#999;}
.doc-blogview .view-head{color:#999;margin-bottom:10px;}
.doc-blogview .view-body{padding-top:15px;}
.doc-blogcode{border:solid 1px #ddd;border-radius:0 0 4px 4px;padding:15px;background:#fff;font-size:12px;}
.doc-viewad0,.doc-codead0{border-color:#cec;}
.doc-codead0{background:#efe;}
.doc-viewad1,.doc-codead1{border-color:#ffd324;}
.doc-banner{color:#fff;padding:70px 10%;background:#0a8;}
.doc-banner h1{font-size:36px;}
.doc-banner h3{font-size:22px;padding:0 10%;}
.doc-banner .button-big{padding:14px 25px;margin-bottom:15px;border:solid 2px #fff;}
.doc-banner .button-big:hover{background:#f00;color:#fff;border:solid 2px #f00;}
.fixed-top .margin-top {margin-top: 0px;}
.fixed-top.doc-fixed-top{margin-top:60px;z-index:9;filter:alpha(opacity=80);opacity:.8;}
.fixed-bottom.doc-fixed-bottom{z-index:9;left:0;right:0;filter:alpha(opacity=80);opacity:.8;}
.nav .active a {
    font-weight: 100;
}
.paoma {
    width: 100%;
    font-size: 12px;
    bottom: 0;
    position: fixed;
}
.marquee {font-size: 13px;
    line-height: 13px;}
.dlink a {}
.grid .ul .item {
    background-color: #FFF;
    box-shadow: 0 1px 1px rgba(0,0,0,0.15);
    overflow: hidden;
    position: relative;
    border: 10px solid #FFF;
    border-bottom: 0 none;
    margin-bottom: 30px;
}
.grid .ul .item .thumb {
    position: relative;
    line-height: 1;
    text-align: center;

    overflow: hidden;
    -webkit-transition: .15s all linear;
    -moz-transition: .15s all linear;
    -o-transition: .15s all linear;
    transition: .15s all linear;
    color: #FFF;
    box-shadow: 0 0 2px rgba(255,255,255,.15)
}
.grid .ul .item .thumb .qtag {
    padding: 0 3px;
    color: #fff;
    font-size: 12px;
    right: 0px;
    bottom: 0px;
    position: absolute;
    border: none;
}
.grid .ul .item .thumb .dvdtag {
    background: #09C878;
}
.grid .ul .item .thumb img {
    display: block;
    width: 100%;
    height: 200px;
    -webkit-transition: all .2s cubic-bezier(0.33, 0, 0.2, 1);
    -moz-transition: all .2s cubic-bezier(0.33, 0, 0.2, 1);
    -o-transition: all .2s cubic-bezier(0.33, 0, 0.2, 1);
    transition: all .2s cubic-bezier(0.33, 0, 0.2, 1)
}
.grid .ul .item .meta {
    padding: 8px 5px;
}
.grid .ul .item .title a {
    color: #888;
    font-size: 14px;
    display: block;
    height: 18px;
    line-height: 18px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}
.grid .ul .item:hover .title a {
    color: #00c3b6
}
.grid .ul .item .extra {
    position: absolute;
    left: 0;
    top: 0;
    height: auto;
    overflow: hidden;
    width: 100%;
    background-color: #222;
    color: #FFF;
    margin: 0;
    padding: 8px 10px;
    box-sizing: border-box;
    -webkit-transform: translateY(-50px);
    -moz-transform: translateY(-50px);
    -ms-transform: translateY(-50px);
    -o-transform: translateY(-50px);
    transform: translateY(-50px);
    -webkit-transition: -webkit-transform .2s cubic-bezier(0.33, 0, 0.2, 1);
    -moz-transition: -moz-transform .2s cubic-bezier(0.33, 0, 0.2, 1);
    -o-transition: -o-transform .2s cubic-bezier(0.33, 0, 0.2, 1);
    transition: transform .2s cubic-bezier(0.33, 0, 0.2, 1)
}
.grid .ul .item .extra a {
    color: rgba(255,255,255,.9)
}
.grid .ul .item .extra a:hover {
    color: #00c3b6
}
.grid .ul .item .extra .time {
    float: left
}
.grid .ul .item .extra .time i {
    margin-right: 4px
}
.grid .ul .item .extra span {
    float: right;
    margin-left: 8px
}
.grid .ul .item .extra i {
    margin-right: 4px
}
.grid .ul .item .extra span i {
    margin-right: 0;
    margin-left: 4px
}
.grid .ul .item .data {
    border-top: 1px solid #f2f2f2;
    padding: 8px 5px;
    color: #999;
    font-size: 12px;
}
.grid .ul .item .data a {
    color: #999
}
.grid .ul .item .data a:hover {
    color: #00c3b6
}
.grid .ul .item .data span {
    float: right;
    margin-left: 10px
}
.grid .ul .item .data span i {
    margin-right: 4px
}
.grid .ul .item:hover .extra {
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px)
}
.grid .ul .item:hover .thumb {
    background-color: #000
}
.grid .ul .item:hover .thumb img {
    opacity: .9;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);

    transition: all 1s ease 0s;
    transform: scale(1.1);
}
#playview {background-image: url("b840efb8d0404316989dd608f181f47d.gif");}
@media (min-width:760px){.doc-nav{text-align:right;}
    .doc-naver .doc-logo{display:block;margin:0px;}
    /*.bg-inverse .navbar-head, .bg-inverse .navbar-text{padding: 0px}*/
}
@media (max-width:768px) {
    .doc-header.fixed-top {border-bottom: 0px;}
    .doc-header .container{padding: 0px;}
    .bg-inverse .nav {padding: 0}
    .nav {padding: 0}
    .navbar-body .nav li {border: none;}
    .container{padding: 0px}
    .line-middle {margin: 0px;}
    .doc-header .container.margin-top{margin: 0}
    .nav li {
        text-align: center;
        color: #fff;
       /* background-color: #0a8;*/
        float: left;
        width: 33.3%;
        height: 40px;
    }

    .nav .drop-menu li {
        text-align: center;
        color: #fff;
        background-color: #0a8;
        float: none;
        width: 100%;
    }
    .nav li a{
        height: 40px;
        line-height: 30px;
        color:#fff;
        border: 1px solid #fff;
    }
    .navbar-body .nav a,.bg-inverse .nav-inline .nav-head, .bg-inverse .nav-inline li a {
    text-indent: 0;
}
    .nav .drop-menu li a{
        color:#000;
        height: 40px;
        line-height: 30px;
    }
    .nav li:after {

        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        -webkit-transform-origin: 0 0;
        -webkit-transform: scale(1);
        border-left: 1px solid rgba(80, 37, 9, 0.36);
        border-bottom: 1px solid rgba(80, 37, 9, 0.36);
    }
    .grid .ul .item {border: 5px solid #FFF;margin-bottom: 10px;}
    .grid .ul .item .data{padding: 3px 5px;}
    .grid .ul .item .thumb img {

    height: 110px;
}
    .button-group {padding: 5px;text-align: center;}
    .button-group .button {border-radius:0;}
    .button-group a{width: 25%;margin-top: 5px}
    .doc-banner{padding:0px 10%;}
    .duilianimg {width:120px;height:120px;}
    .duilianimg1 {width:80px;height:150px;}
    

.lazy{width: 70%;}
}
.doc-intro{color:#fff;padding:40px 0;background:#0a8;}
.doc-intro h1{margin-bottom:15px;font-size:32px;}
.doc-intro p{font-size:22px;}
.doc-backtop{position:fixed;right:5px;bottom:0;color:#999;font-size:30px;cursor:pointer;z-index:9;}
.doc-backtop:hover{color:#0a8;}
.doc-footer{padding:20px 0;text-align:center;}




/*-Page-*/
.pages {text-align:center; overflow:hidden;     line-height: 36px;
    font-size: 0px;}
.pages em {margin-left:4px; font-weight:bold; color:#7f7f7f;  font-weight:normal;} 
.pages input {margin-left:10px; height:22px; width:30px;}
.pages .pagelink_a,.pages .pagelink_b,.pages .pagenow{background-color: #fff;
    padding: 2px 15px;
    line-height: 30px;
    border-radius: 4px;
    display: inline-block;
    margin: 5px;
    vertical-align: top;
    border: solid 1px;font-size:14px;}
    .pages .pagenow { background:#323436;
    color: #fff;
    border: #969494 solid 1px;
     }
     .pages  a:hover {
    background-color: #323436;
    color: #FFF;
    border: #969494 solid 1px;
        text-decoration: none;
}
    .pages input {display: none}
.pages .pagebtn{border:1px solid #CCCCCC; height:24px; width:40px;text-align:center; cursor: hand;}
/*-/Page-*/
.x12 a{float: left;text-align: center;font-family:微软雅黑;width: 10%}@media (max-width: 760px){.x12 a{width: 24%;font-size: 12px;}}@media (max-width:769px){.pages .pagelink_b{display:none;}}.xinwen{border:1px solid #ddd;padding:5px;margin-bottom:1px;}.xinwen a{padding:5px;font-size:15px;color:#FF6666;font-weight:bolder;}.xinwen .xwmenu{width:100%;}@media only screen and (min-width:1024px){.detail img{max-width:720px;height:auto;}}@media screen and (min-width:320px) and (max-width:800px){.detail img{max-width:100%;}}.endpage{width:100%;FONT-SIZE:12px;BORDER:#ececec 1px solid;BACKGROUND:#fff;PADDING:0 16px 10px 16px;DISPLAY:inline-block;FONT-FAMILY:inherit;FONT-WEIGHT:normal;FONT-STYLE:normal;}.endpage .mox{BORDER:#f2f2f2 1px solid;PADDING:3px;}.endpage .play-list{OVERFLOW:hidden;HEIGHT:100%;PADDING:0px 0px 6px 4px;}.endpage .play-list A{OVERFLOW:hidden;HEIGHT:30px;WIDTH:144px;BACKGROUND:#07a7e1;COLOR:#fff;TEXT-ALIGN:center;MARGIN:8px 8px 0px 0px;DISPLAY:inline-block;LINE-HEIGHT:30px}